let token = localStorage.getItem("token")
window.onload = function () {
    if (token) {
        userImg = document.querySelectorAll(".user_icon")
        userImg[0].src = "images/user_login_icon.png"
        userImg[1].src = "images/user_login_icon.png"
    }
}


// 切换收藏页面
document.querySelector(".collect_detail").addEventListener("click", function () {
    if (token) {
        document.querySelector(".person_setting").style.display = "none"
        document.querySelector(".watch_history").style.display = "none"
        document.querySelector(".detail_collect").style.display = "block"
        getCollect()
    }
})

// 收藏导航栏颜色变化
const choice = document.querySelectorAll(".detail_collect_choice span")
choice.forEach((item) => {
    item.addEventListener('click', function () {
        choice.forEach(item => {
            item.classList.remove('collect_choose')
        })
        item.classList.add('collect_choose')
    })
})

//克隆收藏item节点
function cloneAItem(item) {
    // console.log(item)
    const detailItem = document.querySelector(".detail_collect_item")
    const cloneItem = detailItem.cloneNode(true)
    const xhr = new XMLHttpRequest()
    let cloneData
    xhr.responseType = 'json'
    xhr.open('GET', `https://blog.zifeiyu.love/video/query?id=${item.episodeId}`)
    xhr.send()
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) {
            if (xhr.status >= 200 && xhr.status < 300) {
                cloneData = xhr.response.data
                // console.log(cloneData)
            }
        }
    }
    xhr.addEventListener('loadend', () => {
        cloneItem.children[0].children[0].src = cloneData.cover
        cloneItem.children[1].innerHTML = cloneData.name
        document.querySelector(".detail_collect_list").appendChild(cloneItem)
    })
}

// 获取收藏内容
function getCollect() {
    const xhr = new XMLHttpRequest()
    xhr.responseType = 'json'
    xhr.open('GET', `https://blog.zifeiyu.love/info/collect?id=&page=1&pageSize=10`)
    xhr.setRequestHeader("token", `${token}`)
    xhr.send()
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) {
            if (xhr.status >= 200 && xhr.status < 300) {
                const collectData = xhr.response.data.records
                // console.log(collectData)
                if (collectData.length !== 0) {
                    document.querySelector(".detail_collect_item").style.display = "inline-block"
                }
                for (let i = 0; i < collectData.length; i++) {
                    if (i === 0) {
                        const xhr = new XMLHttpRequest()
                        let collect1Data
                        xhr.responseType = 'json'
                        xhr.open('GET', `https://blog.zifeiyu.love/video/query?id=${collectData[0].episodeId}`)
                        xhr.send()
                        xhr.onreadystatechange = function () {
                            if (xhr.readyState === 4) {
                                if (xhr.status >= 200 && xhr.status < 300) {
                                    collect1Data = xhr.response.data
                                    console.log(collect1Data)
                                }
                            }
                        }
                        xhr.addEventListener('loadend', () => {
                            document.querySelector(".collect_item_img").src = collect1Data.cover
                            document.querySelector(".detail_collect_item_title").innerHTML = collect1Data.name
                        })
                    }
                    else cloneAItem(collectData[i])
                }
            } else {
                console.error('Request failed:' + xhr.status)
            }
        }
    }
}



// 切换登出、注销页面
document.querySelector(".setting_detail").addEventListener("click", function () {
    if (token) {
        document.querySelector(".detail_collect").style.display = "none"
        document.querySelector(".watch_history").style.display = "none"
        document.querySelector(".person_setting").style.display = "block"
        document.querySelector(".logout_btn").addEventListener("click", () => { logout() })
    }
})



// 切换历史观看页面
document.querySelector(".history_detail").addEventListener("click", function () {
    if (token) {
        document.querySelector(".person_setting").style.display = "none"
        document.querySelector(".detail_collect").style.display = "none"
        document.querySelector(".watch_history").style.display = "block"
        getHistory()
    }
})

// 获取历史观看信息
function getHistory() {
    const xhr = new XMLHttpRequest()
    xhr.responseType = 'json'
    xhr.open('GET', `https://blog.zifeiyu.love/info/history?page=1&pageSize=10`)
    xhr.setRequestHeader("token", `${token}`)
    xhr.send()
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) {
            if (xhr.status >= 200 && xhr.status < 300) {
                const historyData = xhr.response.data.records
                // console.log(historyData)
                if (historyData.length !== 0) {
                    document.querySelector(".watch_history_item").style.display = "inline-block"
                }
                for (let i = 0; i < historyData.length; i++) {
                    if (i === 0) {
                        const xhr = new XMLHttpRequest()
                        let history1Data
                        xhr.responseType = 'json'
                        xhr.open('GET', `https://blog.zifeiyu.love/video/query?id=${historyData[0].id}`)
                        xhr.send()
                        xhr.onreadystatechange = function () {
                            if (xhr.readyState === 4) {
                                if (xhr.status >= 200 && xhr.status < 300) {
                                    history1Data = xhr.response.data
                                    // console.log(history1Data)
                                }
                            }
                        }
                        xhr.addEventListener('loadend', () => {
                            document.querySelector(".history_item_img").src = history1Data.cover
                            document.querySelector(".history_item_title").innerHTML = history1Data.name + ' 第一集'
                        })
                    }
                    else cloneHistoryItem(historyData[i])
                }
            } else {
                console.error('Request failed:' + xhr.status)
            }
        }
    }
}

//克隆history的item节点
function cloneHistoryItem(item) {
    const detailItem = document.querySelector(".watch_history_item")
    const cloneItem = detailItem.cloneNode(true)
    const xhr = new XMLHttpRequest()
    let cloneData
    xhr.responseType = 'json'
    xhr.open('GET', `https://blog.zifeiyu.love/video/query?id=${item.id}`)
    xhr.send()
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) {
            if (xhr.status >= 200 && xhr.status < 300) {
                cloneData = xhr.response.data
                // console.log(cloneData)
            }
        }
    }
    xhr.addEventListener('loadend', () => {
        cloneItem.children[0].children[0].src = cloneData.cover
        cloneItem.children[1].innerHTML = cloneData.name
        document.querySelector(".watch_history_detail").appendChild(cloneItem)
    })
}